<template>
	<view class="account">
		<view class="account-box">
			<view class="account-logo">
				<!-- <image class="logo-img" :src="localIconSrc('logo.png')"></image> -->
				<image class="logo-img" src="../../static/image/authLogo.png"></image>
				<view class="logo-text">金康云</view>
			</view>
			<view class="account-form">
				<uni-forms ref="valiForm" :rules="rules" :modelValue="accountFormData">
					<uni-forms-item name="account">
						<view class="input-bottom">
						  <uni-easyinput
								:inputBorder="false"
								:styles="styles"
								:clearable="false"
								primaryColor="#999"
								placeholderStyle="font-size: 32rpx;"
								class="input-class"
								v-model="accountFormData.username"
								placeholder="用户名/手机号/邮箱"
						  />
						</view>
					</uni-forms-item>
					<uni-forms-item name="password">
						<view class="input-bottom">
						  <uni-easyinput
								:inputBorder="false"
								:styles="styles"
								:clearable="false"
								primaryColor="#999"
								type="password"
								placeholderStyle="font-size: 32rpx;"
								v-model="accountFormData.password"
								placeholder="请输入登录密码"
							/>
						</view>
					</uni-forms-item>
				</uni-forms>
			</view>
			<view class="forget-item">
				<button class="forget-link" @click="toPassword">忘记密码？</button>
				<button class="forget-link" @click="toUsername">忘记会员名？</button>
			</view>
			<button class="login-btn" @click="goAccountLogin">登录授权</button>
		</view>             
	</view>
</template>

<script>
	import { bindingWxApp, getEndOpenId, getUserInfo, getTicket } from '@/api/login.js'
	export default {
		data() {
			return {
				rules: {},
				accountFormData: {
					username: '',
					password: ''
				},
				styles: {
					borderColor: 'transparent',
					color: '#999'
				},
				clientId: '073820240321128890',
				clientSecret: 'fa1c7b3f5494bf1c9d1a3e73433a66e6',
			}
		},
		onLoad() {
			console.log('账号登录页面加载')
		},
		methods: {
			toPassword() {
				uni.navigateTo({
					url: '/pages/login/findPassWord/findPassWord'
				})
			},
			toUsername() {
				uni.navigateTo({
					url: '/pages/login/findUsername/findUsername'
				})
			},
			goAccountLogin() {
				const param = {
					"access_token": uni.getStorageSync('acctoken'),
					"wxid": 'gh_85adb5b7352f',
					"client_id": '073820240321128890',
					"password": this.accountFormData.password,
					"username": this.accountFormData.username
				};
				bindingWxApp(param).then(res => {
					console.log('授权登录', res)
					if(res.errcode == '200') {
						let openIdStr = {
							"access_token": tokenRes.access_token
						}
						getEndOpenId(openIdStr).then(openIdReq => {
							console.log('openIdReq', openIdReq)
							if(openIdReq.errcode && openIdReq.errcode!=200){
								uni.showToast({
									title:'未知错误('+openIdReq.errcode+')',
									icon:'none',
									duration:5000
								})
							} else {
								uni.setStorageSync('openid', openIdReq.openid)
								let useStr = {
									"access_token": tokenRes.access_token,
									"appid": clientId,
									"openid": openIdReq.openid
								}
								// 储存oauth_consumer_key
								getUserInfo(useStr).then(userInfo => {
									console.log('userInfo', userInfo)
									uni.setStorageSync('oauthConsumerKey', userInfo.oauth_consumer_key)
									uni.setStorageSync('portrait', userInfo.portrait)
									let ticketStr = {
										"oauth_consumer_key": userInfo.oauth_consumer_key,
										"appid": clientId,
										"openid": openIdReq.openid
									}
									getTicket(ticketStr).then(ticket => {
										console.log(ticket, 'ticket')
										uni.setStorageSync('apiticket', ticket.api_ticket );
										uni.switchTab({
											url: `/pages/home/index`,
										});
									})
									resolve(userInfo)
								}).catch(err => {
									console.log('1')
									uni.hideLoading()
								})
							}
						}).catch(err => {
							console.log('2')
							uni.hideLoading()
						})
						uni.navigateTo({
							url: '/pages/home/index'
						})
					} else {
						uni.showToast({
							title: res.errmsg,
							icon:'none',
							duration:5000
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.account {
		position: relative;
		width: 100vw;
		height: 100vh;
	}
	.account-box {
		position: absolute;
		left: 50%;
		top: 10%;
		transform: translate(-50%);
		width: 600upx;
		height: 936upx;
		.account-logo {
			margin-bottom: 120upx;
			text-align: center;
			.logo-img {
				// width: 192rpx;
				// height: 192rpx;
				width: 180rpx;
				height: 180rpx;
			}
			.logo-text {
				color: #ff6005;
				font-size: 60rpx;
			}
		}
		.forget-item {
			display: flex;
			float: right;
			button {
				width: 160upx;
				padding: 0px;
				background-color: transparent;
			}
			button::after {
				border: none;
			}
			.forget-link {
				color: #999;
				font-size: 24upx;
			}
		}
		.login-btn {
			margin-top: 210upx;
			color: #fff;
			background-color: #ff6005;
			border-radius: 50rpx;
		}
	}
	.input-bottom {
		border-bottom: 1px solid #f0f0f0;
	}
	::v-deep .uni-easyinput__content-input {
		color: #999;
		font-size: 32upx;
	}
</style>